<template>
    <div style="width:100%;height:100%">
      <img :src="getDetail.src" alt="Smiley face" width="100%" height="100%" style="max-width: 100%">
    </div>
</template>
<script>

export default {
  props: ['index'],
  computed: {
    insideSlideArray () {
      return this.$store.state.layout[this.$store.state.activeArrayIndex].SlideContent
    },
    insideArrayIndex () {
      return this.insideSlideArray.indexOf(this.insideSlideArray.filter((currentValue) => {
        return currentValue.i === this.index
      })[0])
    },
    getDetail () {
      return this.$store.state.layout[this.$store.state.activeArrayIndex].SlideContent[this.insideArrayIndex].itemContent.detail
    }
  }
}
</script>
